<ng-container *ngIf="profile$ | async as profile">
  <div class="enterprise-body">
    <div class="title">企业定制</div>

    <div class="row">
      <div class="subject mt-3">平台名称：</div>
      <div class="detail">
        <input class="form-control" [formControl]="nameControl" maxlength="8" />
        <div class="comment">网站标题, 显示在浏览器 Tab 中</div>
      </div>
      <ng-container *ngIf="nameControl.dirty">
        <button mat-icon-button (click)="changeName(nameControl.value)">
          <mat-icon>check_circle</mat-icon>
        </button>
        <button mat-icon-button (click)="nameControl.reset(profile.name)">
          <mat-icon>highlight_off</mat-icon>
        </button>
      </ng-container>
    </div>

    <div class="row">
      <div class="subject">网站Logo：</div>
      <div class="detail">
        <m-image-preview
          class="logo"
          [control]="logoInputRef"
          [src]="profile.logo"
          [saveBtn]="true"
          (saved)="changeImage('logo', logoInputRef)"
        >
          <input type="file" accept="image/*" #logoInputRef hidden />
        </m-image-preview>
      </div>
    </div>

    <div class="row">
      <div class="subject">网站图标：</div>
      <div class="detail">
        <m-image-preview
          class="favicon"
          [control]="faviconInputRef"
          [src]="profile.favicon"
          [saveBtn]="true"
          (saved)="changeImage('favicon', faviconInputRef)"
        >
          <input type="file" accept="image/*" #faviconInputRef hidden />
        </m-image-preview>
      </div>
    </div>

    <div class="row" *ngIf="false">
      <div>部门设置：</div>
      <div class="detail">
        <m-department></m-department>
      </div>
    </div>

    <div class="row" *ngIf="false">
      <div class="mt-2">职位设置:</div>
      <div class="detail">
        <m-api-list [API]="positionService"></m-api-list>
      </div>
    </div>

    <div class="row">
      <div class="subject mt-2">软件分类:</div>
      <div class="detail">
        <m-api-list [API]="softwareCategory"></m-api-list>
      </div>
    </div>
  </div>
</ng-container>
